import React from 'react'
import Cen from '../css/Center.module.css'
import { Row, Col, Icon } from 'antd';



export default class Center extends React.Component {
    constructor(props) {
        super(props)
    }
    order(){
        this.props.history.push('/orderdetail')
    }
    render() {
        return (
            <div className={Cen.xinxi}>
                <div className={Cen.toux}>
                    <div className={Cen.topp}>
                        <div className={Cen.pilce}>
                            <img src="https://wanjuyueqi01-mb.126net.cn/jrfr/ucenter/images/defaultmen.png" className={Cen.imgg} />
                            <p> <span>用户名</span><span>普通会员</span></p>
                            <p> <span>我的优惠劵<i>0</i></span><span>我的收藏<i>1</i></span></p>
                        </div>
                        <div className={Cen.right}>
                            <p>我的消息<b></b><i>0</i></p>
                        </div>
                    </div>
                    <div className={Cen.ding}>
                        <h5>
                            我的订单
                        <span>查看所有订单</span>
                        </h5>
                        <div className={Cen.dingx}>
                            <Row className={Cen.row} >
                                <Col span={8} className={Cen.shangp}>商品</Col>
                                <Col span={8} className={Cen.shangp1}>
                                    <Col span={6} >单价</Col>
                                    <Col span={6} >数量</Col>
                                    <Col span={6} >退换货</Col>
                                    <Col span={6} >评价</Col>
                                </Col>
                                <Col span={8} >
                                    <Col span={8} >实付款</Col>
                                    <Col span={8} >物流</Col>
                                    <Col span={8} >操作</Col>
                                </Col>
                            </Row>
                            <div className={Cen.myding}>
                                <h5>
                                    订单号：13281562848694593741
                            <span>2019-07-11 20:38:14</span>
                                </h5>
                                <Row className={Cen.row1} >
                                    <Col span={8} className={Cen.shangp}>
                                        <Col span={12} ><img src="http://image.fast.126net.cn/group2/M00/01/C2/wKgADlvWqBCANCvuAAAkeEomvDw602.jpg" /></Col>
                                        <Col span={12} className={Cen.erf} >
                                            <Col span={24} >
                                                优必选阿尔法Alpha 1P智能机器人玩</Col>
                                            <Col span={24} className={Cen.mouren} >
                                                默认</Col>
                                        </Col>
                                    </Col>
                                    <Col span={8} className={Cen.shangp1}>
                                        <Col span={6} >3,999.00</Col>
                                        <Col span={6} >1</Col>
                                        <Col span={6} >不可退货</Col>
                                        <Col span={6} >评价</Col>
                                    </Col>
                                    <Col span={8} >
                                        <Col span={8} >3，900.00</Col>
                                        <Col span={8} >未发货</Col>
                                        <Col span={8} className={Cen.erf1}>
                                            <Col span={24} onClick={this.order.bind(this)} >订单详情</Col>
                                            <Col span={24} >立即支付</Col>
                                            <Col span={24} >取消订单</Col>
                                        </Col>
                                    </Col>
                                </Row>
                            </div>
                        </div>
                    </div>
                    {/* 我的订单 */}
                    <div className={Cen.shou}>
                        <h5>
                            我的订单  </h5>
                        <div className={Cen.quan}>
                            <div className={Cen.kongtu}>
                                <img src="https://wanjuyueqi01-mb.126net.cn/res/jrfcms/img/admin/default/nodataImg.gif" />
                                <h2>没有相关数据！</h2>
                            </div>
                            <div className={Cen.shoutu}>
                                <ul className={Cen.listtu}>
                                    <li>
                                        <a>
                                            <div>
                                                <img src="http://image.fast.126net.cn/group2/M00/01/C2/wKgADlvWojWAR0mXAABErc_FUAQ077.jpg" />
                                            </div>
                                            <p>智能玩具机器人 儿童遥控电动机器狗 语音</p>
                                        </a>
                                        <div className={Cen.baby_box}>
                                            <div className={Cen.baby_price}>¥ <span>338</span>
                                                <Icon type="delete" className={Cen.list_a} />
                                            </div>
                                        </div>
                                    </li>
                                    <li>
                                        <a>
                                            <div>
                                                <img src="http://image.fast.126net.cn/group2/M00/01/C2/wKgADlvWqBCANCvuAAAkeEomvDw602.jpg" />
                                            </div>
                                            <p>优必选阿尔法Alpha 1P智能机器人玩</p>
                                        </a>
                                        <div className={Cen.baby_box}>
                                            <div className={Cen.baby_price}>¥ <span>338</span>
                                                <Icon type="delete" className={Cen.list_a} />
                                            </div>
                                        </div>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        )
    }
}